<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>后台分类管理</title>
	<script type="text/javascript" src="js/jquery-2.1.1.js"></script>
	<link rel="stylesheet" href="css/reset.css" />
	<link rel="stylesheet" href="css/content.css" />
	<script type="text/javascript">
		 //创建并返回异步请求对象
    	function createXMLHttpRequest(){
    	   var xmlReq = new XMLHttpRequest();
    	   return xmlReq;
    	}
    	
    	var xmlHttpReq;
    	function skippage(curr){
    	//alert(1);
    	var typename = document.getElementById("searchname").value;
    	    var url='${pageContext.request.contextPath }/ajax/pagequerytypeajax?curr='+curr+'&name='+typename;
		    //1.创建异步请求对象
		    xmlHttpReq=createXMLHttpRequest();
		    //2.建立到服务器的新请求
            xmlHttpReq.open("post",url);
            //3.设定服务器响应回调方法：告诉服务器数据返回后应该怎么处理
            xmlHttpReq.onreadystatechange=showtypeData;//指定回调函数
            //4.发送异步请求
            xmlHttpReq.send(null);
    	}
    	
    	function showtypeData(){
    		 if(xmlHttpReq.readyState==4){
	           //alert(xmlHttpReq.status);
	           if(xmlHttpReq.status==200){
	             //alert(xmlHttpReq.responseText);
	             var xmldoc=xmlHttpReq.responseXML;
	             typeSelect(xmldoc);
	           }        
        	}
    	}
    	function typeSelect(xmldoc){
    		$("#tb").empty();
    		var idArray = xmldoc.getElementsByTagName("id");
    		var nameArray = xmldoc.getElementsByTagName("name");
    		var tbobj = document.getElementById("tb");
    		for(var i=0;i<idArray.length;i++){
    		    var optTr = document.createElement("tr");
    		    var optObj1 = document.createElement("td");
    		    var optObj2 = document.createElement("td");
    		    var optObj3 = document.createElement("td");
    		    optObj1.innerHTML=idArray[i].innerHTML;
    		    optObj2.innerHTML=nameArray[i].innerHTML;
    		    optObj3.innerHTML="<div class='table-fun'><a onclick='remove(optObj1);' style='cursor:pointer'>删除</a></div>";
    		    optTr.appendChild(optObj1);
    		    optTr.appendChild(optObj2);
    		    optTr.appendChild(optObj3);
    		    tbobj.appendChild(optTr);
    		    
    		}
    	}
	
	function skip(){
	var pagecurrval = document.getElementById("pagecurr").value;
	skippage(pagecurrval);
	}
	
	function remove(id){
    		if(confirm("您确定要删除编号为  ["+id+"]  的类型?  (该类型的所有商品也将被删除！！！)")){
    			$.ajax({
    				type:'post',
    				url:'${pageContext.request.contextPath}/ajax/removetypeajax',
    				data:{
    					typeid:id
    				},
    				
    				success:function(response,status,xhr){
    					if(response==true){
    						alert("删除成功");
    					}
    				}
    			});
    		}
    	}
	
	
	$(function(){
		$("#searchname").change(function(){
		//alert(1);
			$.ajax({
				type:'post',
				url:'${pageContext.request.contextPath}/ajax/namequerytypeajax',
				data:{
					curr:1,
					name:$("#searchname").val()
				},
				success:function(response,status,xhr){
					var jsonobj = eval('('+response+')');
					var lengthlist = jsonobj.typelist.length;
						if(lengthlist==0){
							alert("您查询的商品类型不存在！！！");
						}else{
							$("#tb").empty();
						var tbobj = document.getElementById("tb");
						
						for(var i=0;i<lengthlist;i++){
						//alert(jsonobj.userlist[i].userName);
								var optTr = document.createElement("tr");
				    		    var optObj1 = document.createElement("td");
				    		    var optObj2 = document.createElement("td");
				    		    var optObj3 = document.createElement("td");
				    		    optObj1.innerHTML=jsonobj.typelist[i].typeid;
				    		    optObj2.innerHTML=jsonobj.typelist[i].typename;
				    		    optObj3.innerHTML="<div class='table-fun'><a onclick='remove(optObj1);' style='cursor:pointer'>删除</a></div>";
				    		    optTr.appendChild(optObj1);
				    		    optTr.appendChild(optObj2);
				    		    optTr.appendChild(optObj3);
				    		    tbobj.appendChild(optTr);
						}	
						}
						
				}	
			});
		});
	});
	
	</script>
</head>
<body marginwidth="0" marginheight="0">
	<div class="container">
		<div class="public-nav">您当前的位置：<a href="">管理首页</a>><a href="">分类管理</a></div>
		<div class="public-content">
			<div class="public-content-header">
				<h3>分类列表
				<span style="float:right;margin-right:15px;">
					<label style="color:#333">搜索：</label><input type="text" placeholder="搜索分类(回车搜索)" id="searchname" style="height:20px"/>
				</span>
				</h3>
			</div>
			<div class="public-content-cont">
				<table class="public-cont-table">
					<tr>
						<th style="width:10%">编号</th>
						<th style="width:30%">分类名称</th>					
						<th style="width:20%">操作</th>
					</tr>
					<tbody id="tb">
					<c:forEach items="${sessionScope.typepage.typelist}" var="type" varStatus="t">
					<tr>
						<td>${type.typeid}</td>
						<td>${type.typename}</td>
						<td>
							<div class="table-fun">
								<a onclick="remove('${type.typeid}');" style="cursor:pointer">删除</a>
							</div>
						</td>
					</tr>
					</c:forEach>
					</tbody>
				</table>
				<div class="page">
						<a onclick="skippage('1');" style="cursor:pointer;">首页</a>
						<a onclick="skippage('${sessionScope.typepage.currentpage==1?1:sessionScope.typepage.currentpage-1}');" style="cursor:pointer;">上一页</a>
						<a onclick="skippage('${sessionScope.typepage.currentpage!=sessionScope.typepage.totalpage?(sessionScope.typepage.currentpage+1):sessionScope.typepage.totalpage}');" style="cursor:pointer;">下一页</a>
						第<span style="color:red;font-weight:600">${sessionScope.typepage.currentpage}</span>页
						共<span style="color:red;font-weight:600">${sessionScope.typepage.totalpage}</span>页
						<input id="pagecurr" type="text" class="page-input">
						<input type="submit" class="page-btn" value="跳转" onclick="skip();">
				</div>
			</div>
		</div>
	</div>
</body>
</html>